<template>
  <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
    <template #success>
      <i class="iconfont icon-success"></i>
      加载成功
    </template>
    <van-list
      v-model="loading"
      :finished="finished"
      finished-text="没有更多了"
      @load="onLoad"
    >
      <!-- <van-cell v-for="item in list" :key="item" :title="item" /> -->
      <action-item
        v-for="item in actionList"
        :key="item.id"
        :thumbs="thumbList"
        :actionItem="item"
      />
    </van-list>
  </van-pull-refresh>
</template>

<script>
import { getRecommendAction, getUsersActionCount } from "@/api/community";
import { mapState } from "vuex";
import actionItem from "./actionItem.vue";

export default {
  components: { actionItem },
  name: "Recommend",

  data() {
    return {
      actionList: [], // 动态发布信息
      thumbList: [], // 点赞信息
      loading: false,
      finished: false,
      refreshing: false,
      page: 1,
    };
  },

  computed: {
    ...mapState("user", ["user"]),
  },

  mounted() {},

  // activated() {
  //   console.log("推荐页激活")
  //   this.onLoad()
  // },

  methods: {
    onLoad() {
      console.log("进入load方法");
      if (this.refreshing) {
        console.log("刷新");
        this.page = 1;
        this.actionList = [];
        this.thumbList = [];
        this.refreshing = false;
        // let data = {
        //   page: this.page,
        //   userId: this.user.id,
        // };
        // this.page++;

        // getRecommendAction(data).then(res => {
        //   console.log("数据刷新成功")
        //   this.actionList = res.data.actionList;
        //   this.thumbList = [...res.data.thumbList];
        //   this.refreshing = false;
        // })
      }

      console.log("加载");
      let userList = [];
      getUsersActionCount(userList).then((res) => {
        console.log("总数res = ", res);
        console.log("this.page = ", this.page);
        let count = res.data;
        if ((this.page - 1) * 10 >= count) {
          console.log("不用发送请求了");
          this.finished = true;
          this.loading = false;
          return;
        } else {
          console.log("还有数据，继续请求");
          let data = {
            page: this.page,
            userId: this.user.id,
          };
          getRecommendAction(data).then((res) => {
            this.actionList = [...this.actionList, ...res.data.actionList];
            this.page++;
            this.thumbList = [...res.data.thumbList];
            this.loading = false;
          });
        }
      });
    },

    onRefresh() {
      // 清空列表数据
      this.finished = false;

      // 重新加载数据
      // 将 loading 设置为 true，表示处于加载状态
      this.loading = true;
      setTimeout(() => {
        this.onLoad();
      }, 1000);
    },
  },
};
</script>

<style scoped>
</style>